<template>
	<div class="productSelection">
		<!-- 新增产品选择 -->
    <TopFilter
      ref="TopFilterss"
      :list="topFilterList"
      :cols="2"
      labelWidth="90"
      @filterChange="changeHandle"
    />

		<div style="margin-top: 15px;"></div>
		<FilterTable
      ref="table"
      :onRowSelectChange="selectChange"
      :fetchapi="fetchApi"
      :params="fetchParams"
      :datakey="'records'"
      :columns="columns"
      :onColumnsChange="columns => this.columns = columns"
    />
    <!-- <FilterTable
      ref="table"
      selectionType="single"
      :dataSource="dataSource"
      :onRowSelectChange="selectChange"
      :datakey="'records'"
      :columns="columns"
      :onColumnsChange="columns => this.columns = columns"
    /> -->

		<div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'right'
      }"
    >
      <el-button @click="closeDialog">取 消</el-button>
      <el-button :disabled="this.isChoice" @click="saveDialog" type="primary">保 存</el-button>
    </div>


	</div>
</template>

<script>
import { vehicleConfiguration } from '@/api/retail/salesmanage/confirmcar'; //获取五级菜单
import { vehicleDataQuery } from '@/api/retail/salesmanage/salesordermanage';
export default {
  name: 'productSelection',
  props: {
    modifyType: {
      default: false,
      type: Boolean
    },
  },
	data (){
		return {
			topFilterList: this.createTopFilters(), //搜索数据
			columns: this.createTableColumns(), //table数据
      fetchApi: vehicleDataQuery,
      fetchParams: {
        // pageNum: 1,
        // currentPage: 1,
        // pageSize: 20,
        // limit: 20
      },
      selectedRows: [], //选中列表中的行
      isChoice: true, //按钮是否可以选择

		}
	},
  created (){
    this.init();
  },
	methods: {
    init (){
      vehicleConfiguration(0, {
        isUnlimited: 10041002
      }).then( res => {
        this.topFilterList[2].itemList = res.data;
      }).catch( err => {
        // console.log(err)
      });
    },
    selectChange (rows){ //选中时触发的函数
      this.selectedRows = rows;
      this.isChoice = this.selectedRows.length > 0? false: true;
    },
		createTopFilters (){
			return [
				{
          type: 'INPUT',
          label: '产品代码',
          fieldName: 'productCode',
          placeholder: '请输入...',
        },
        {
          type: 'INPUT',
          label: '产品名称',
          fieldName: 'productName',
          placeholder: '请输入...'
        },
        {
          type: 'INPUT_CASCADER',
          label: '产品配置',
          fieldName: 'carName',
          placeholder: '请选择',
          options:{ titles: ['品牌', '车系', '车型', '配置', '颜色'] },
          itemList:[{
            text: '一级分类1',
            value: '1',
            children: []
          }],
        },


			]
    },
		changeHandle(val) { //搜索事件
      console.log(val)
      let params = {
        productCode: val.productCode,
        productName: val.productName
      }
      if(val.carName){
        let cifg = val.carName.split(',')
        let configure = {
          brandId: cifg[0],
          seriesId: cifg[1],
          modelId: cifg[2],
          packageId: cifg[3],
          color: cifg[4]
        }
        params = Object.assign(params, configure);
      }
      console.log(params)
      this.fetchParams = Object.assign({}, params);
    },
    createTableColumns (){
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '数量',
          dataIndex: 'orderNumber1',
          sorter: true,
          filter: true,
          filterType: 'input',
          render: props => {
            props.row.orderNumber1 = this.modifyType ? 1 : props.row.orderNumber1
            return <el-input disabled={this.modifyType} value={props.row.orderNumber1} placeholder="" onInput={(e)=>{
              props.row.orderNumber1 = e.replace(/[\D]/g, '')
            }}></el-input>
          }
        },
        {
          title: '产品名称',
          dataIndex: 'productName',
          sorter: true,
          filter: true,
          filterType: 'input',
          showOverflowTooltip:true,
        },
        {
          title: '产品代码',
          dataIndex: 'productCode',
          sorter: true,
          filter: true,
          filterType: 'input',
          showOverflowTooltip:true,
        },
        {
          title: '品牌',
          dataIndex: 'brandName',
          sorter: true,
          filter: true,
          filterType: 'input',
          showOverflowTooltip:true,
        },
        {
          title: '车系',
          dataIndex: 'seriesName',
          sorter: true,
          filter: true,
          showOverflowTooltip:true,
          filterType: 'input',
        },
        {
          title: '车型',
          dataIndex: 'modelName',
          sorter: true,
          filter: true,
          showOverflowTooltip:true,
          filterType: 'input',
        },
        {
          title: '配置',
          dataIndex: 'packageName',
          sorter: true,
          filter: true,
          showOverflowTooltip:true,
          filterType: 'input',
        },
        {
          title: '颜色',
          dataIndex: 'color',
          sorter: true,
          showOverflowTooltip:true,
          filter: true,
          filterType: 'input',
        },
        {
          title: '销售指导价',
          dataIndex: 'oemDirectivePrice', // vehiclePrice改为oemDirectivePrice
          sorter: true,
          filter: true,
          filterType: 'input',
          showOverflowTooltip:true,
        },
        {
          title: '销售单价',
          dataIndex: 'vehiclePrice', // price改为vehiclePrice
          sorter: true,
          filter: true,
          filterType: 'input',
          editable: true,
          showOverflowTooltip:true,
        }
      ]
    },
		closeDialog(param) { //取消
      this.$emit('close', false, param);
    },
    saveDialog () { //保存
      // console.log(this.selectedRows)
      let orderNum=[]
      if(this.selectedRows.length > 0){
        this.selectedRows.forEach(x=>{
          if(x.orderNumber1 > 0){
            orderNum.push(x.orderNumber1)
          }
        })

        if(orderNum.length == this.selectedRows.length){
          this.$emit('close2', false, this.selectedRows)
        }else {
          this.$message({
            showClose: true,
            message: '请填写数量',
            type: 'warning'
          });
        }
      }
    },

	},


}
</script>

<style scoped="scoped" lang="less">
</style>
